<template>
	<div>
		<div class="mui-content">
			<ul class="mui-table-view mui-table-view-striped mui-table-view-condensed" >
			<!-- v-infinite-scroll="Loadmore" infinite-scroll-disabled="loading"	infinite-scroll-distance="10"  -->
				<li class="mui-table-view-cell" v-for='item in newslist' :key='item.docid'>
					<router-link :to= "'/home/newsInfo/'+item.docid " >
						<div class="mui-table">
							<div class="mui-table-cell mui-col-xs-10">
								<h4 class="mui-ellipsis">{{ item.title }}</h4>
								<h5>{{ item.category }}</h5>
								<p class="mui-h6 mui-ellipsis">{{ item.ptime}} </p>
							</div>
						</div>
					</router-link>
				</li>
			</ul>
		</div>
	</div>
</template>

<script>
	import {Indicator} from 'mint-ui'

	export default {
		data() {
			return {
				newslist: []
			};
		},

		created() {
			Indicator.open({
				text: '等等，我就要出来了...',
				spinnerType: 'fading-circle'
			});
			this.getNewsList();
		},
		methods: {
			getNewsList() {
				// Indicator.open('Loading...');
				this.$http.get('https://www.apiopen.top/journalismApi').then(res => {
					if (res.body.code === 200) {
						this.newslist = res.body.data.tech;
						Indicator.close();
					}else{
						Toast('获取新闻列表失败！');
					}
				}, () => {
					Toast('获取新闻列表失败！');
					// Indicator.close();
				});

			}
		}
	}

</script>

<style>
	.mui-table-view-cell:after {
		bottom: 1px;
	}
	.mui-content > .mui-table-view:first-child {
		margin-top: 0px;
	}
</style>